<template>
  <el-row>
    <el-col :span="4">
      <h5 class="mb-2">Default colors</h5>
      <el-menu
        default-active="2"
        class="el-menu-vertical-demo"
      >
        <el-sub-menu index="1">
          <template #title>
            <el-icon></el-icon>
            <span>基础信息管理</span>
          </template>
          <el-menu-item-group>
            <el-menu-item index="1-1" @click="toWarehouse">仓库管理</el-menu-item>
            <el-menu-item index="1-2" @click="toArea">库区管理</el-menu-item>
          </el-menu-item-group>

        </el-sub-menu>
      </el-menu>
    </el-col>
    <el-col :span="20" style="padding:30px">
      <router-view></router-view>
    </el-col>
  </el-row>
</template>

<script>
import { useRouter } from 'vue-router'
export default {
  name: 'Home',
  components: {
  },
  setup () {
    const router = useRouter()
    const toWarehouse = () => {
      router.push({ name: 'warehouse' })
    }
    const toArea = () => {
      router.push({ name: 'area' })
    }
    return { toWarehouse, toArea }
  }
}
</script>
